<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <style type="text/css">

    .ux-desktop-shortcut-container {
      width: 415px;
      margin-left: auto;
      margin-right: auto;
      margin-top: 275px;
    }

    .user-mgt-win-shortcut {
      background-image: url("/assets/icons/user/user_105x105.png");
      height: 105px;
      width: 105px;
    }

    .user-mgt-win-shortcut:hover {
      background-image: url("/assets/icons/user/user_105x105_active.png");
      height: 105px;
      width: 105px;
    }

    .app-composer-win-shortcut {
      background-image: url("/assets/icons/control_panel/control_panel_105x105.png");
      height: 105px;
      width: 105px;
    }

    .app-composer-win-shortcut:hover {
      background-image: url("/assets/icons/control_panel/control_panel_105x105_active.png");
    }

    .db-admin-win-shortcut {
      background-image: url("/assets/icons/database/database_105x105.png");
      height: 105px;
      width: 105px;
    }

    .db-admin-win-shortcut:hover {
      background-image: url("/assets/icons/database/database_105x105_active.png");
    }

    .web-navigator-win-shortcut {
      background-image: url("/assets/icons/globe/globe_105x105.png");
      height: 64px;
      width: 64px;
    }

    .web-navigator-win-shortcut:hover {
      background-image: url("/assets/icons/globe/globe_105x105_active.png");
    }

    .website-builder-win-shortcut {
      background-image: url("/assets/icons/website/website_105x105.png");
      height: 64px;
      width: 64px;
    }

    .website-builder-win-shortcut:hover {
      background-image: url("/assets/icons/website/website_105x105_active.png");
    }

    #loading-mask {
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      z-index: 20000;
      background-color: white;
    }

    #loading {
      position: absolute;
      left: 50%;
      top: 50%;
      padding: 2px;
      z-index: 20001;
      height: auto;
      margin: -35px 0 0 -30px;
    }

    #loading .loading-indicator {
      background: url(/assets/erp_app/ext_loading_image.gif) no-repeat;
      color: #555;
      font: bold 13px tahoma, arial, helvetica;
      padding: 8px 42px;
      margin: 0;
      text-align: center;
      height: auto;
    }
  </style>

  <link rel="icon" type="image/png" href="/images/erp_app/favicon.ico">

  <!--javascript-->
  <%= include_extjs(:debug => (Rails.env == 'development' or Rails.env == 'shared_dev')) %>

  <%= javascript_include_tag('extjs/Callout') %>
  <%= javascript_include_tag("erp_app/utility") %>
  <%= javascript_include_tag("erp_app/desktop/app") %>
  <%= javascript_include_tag("erp_app/widgets") %>

  <%= include_widgets %>

  <!-- shared application resources -->
  <%= load_shared_application_resources(:javascripts) %>
  <!-- end shared application resources -->

  <%= javascript_include_tag("erp_app/desktop/applications/web_navigator/app") %>

  <%= static_javascript_include_tag("ckeditor/ckeditor.js") %>

  <!-- end application resources -->
  <%= include_compass_ae_instance %>
  <%= set_max_file_upload %>
  <%= set_file_upload_types %>
  <%= set_email_regex %>

  <!--stylesheets-->
  <%= stylesheet_link_tag('erp_app/desktop/base') %>

  <!-- shared application resources -->
  <%= load_shared_application_resources(:stylesheets) %>
  <!-- end shared application resources -->

  <%= stylesheet_link_tag('extjs/resources/css/callout-default') %>

  <%= setup_js_authentication(@user) %>

  <!-- application resources -->
  <% @user.get_application_resource_paths(:desktop, :js).each do |path| %>
    <%= javascript_include_tag(path) %>
  <% end %>

  <% @user.get_application_resource_paths(:desktop, :css).each do |path| %>
    <%= stylesheet_link_tag(path) %>
  <% end %>

  <!-- code mirror -->
  <%= include_code_mirror_library %>

  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
  <title>Compass Desktop</title>
</head>
<body>
<script type="text/javascript">
  Ext.define("MyDesktop.App", {
    extend: "Ext.ux.desktop.App",
    requires: ["Ext.window.MessageBox", "Ext.ux.desktop.ShortcutModel", "Ext.ux.callout.Callout"],
    init: function () {
      this.callParent()
    },

    getModules: function () {
      return [
        new Compass.ErpApp.Desktop.Applications.WebNavigator(),
        <%=raw @user.desktop_applications.collect{|app| "new Compass.ErpApp.Desktop.Applications.#{app.internal_identifier.classify}()"}.join(",").to_s%>
      ]
    },
    getDesktopConfig: function () {
      var b = this, a = b.callParent();
      return Ext.apply(a, {
        contextMenuItems: [],
        shortcuts: Ext.create("Ext.data.Store", {
          model: "Ext.ux.desktop.ShortcutModel",
          data: [
            <% desktop_apps = current_user.desktop_applications.collect(&:internal_identifier) %>
            <% if desktop_apps.include?('user_management') %>
            {name: "User Management", iconCls: "user-mgt-win-shortcut", module: "user-management-win"},
            <% end %>
            <% if desktop_apps.include?('knitkit') %>
            {name: "Website Builder", iconCls: "website-builder-win-shortcut", module: "knitkit-win"},
            <% end %>
            <% if desktop_apps.include?('rails_db_admin') %>
            {name: "DB Navigator", iconCls: "db-admin-win-shortcut", module: "rails_db_admin-win"}
            <% end %>
          ]
        }),
        wallpaperStretch: true
      })
    },
    getStartConfig: function () {
      var b = this, a = b.callParent();
      return Ext.apply(a, {
        title: '<%=@user.party.description%>',
        iconCls: "icon-user-light",
        height: 300,
        toolConfig: {
          width: 100,
          items: [
            {
              text: "Logout",
              iconCls: "icon-key",
              handler: b.onLogout,
              scope: b
            },
            {
              text: "Profile",
              iconCls: "icon-user",
              handler: b.onProfile,
              scope: b
            },
            {
              text: "About",
              iconCls: "icon-info",
              handler: b.onHelp,
              scope: b
            }
          ]
        }
      })
    },
    getTaskbarConfig: function () {
      var a = this.callParent();
      return Ext.apply(a, {
        quickStart: [],
        trayItems: [
          {
            ui: 'buttonclean',
            xtype: "trayclock",
            flex: 1
          }
        ]
      })
    },
    onLogout: function () {
      Ext.Msg.confirm("Logout", "Are you sure you want to logout?", function (btn, text) {
        if (btn == 'yes') {
          window.location = '/session/sign_out';
        }
      })
    },
    onProfile: function () {
      Ext.create('Ext.window.Window', {
        title: 'Profile',
        iconCls: "icon-user-light",
        layout: 'fit',
        autoScroll: true,
        items: [
          {
            xtype: 'shared_profilemanagementpanel'
          }
        ]
      }).show();
    },
    onHelp: function () {
      var tpl = new Ext.XTemplate("<table>",
          "<tr><td style='width:100px;'>Version: </td><td>{version}</td></tr>",
          "<tr><td>Installed at: </td><td>{installedAt}</td></tr>",
          "<tr><td>Last Update: </td><td>{lastUpdateAt}</td></tr>",
          "</table><br/>",
          "<h3>Installed Engines</h3><br/>",
          "<table>",
          "<tr><th style='width:150px;font-weight:bold;'>Name</th><th style='font-weight:bold;'>Version</th></tr>",
          '<tpl for="installedEngines">',
          "<tr><td>{name}</td><td>{version}</td></tr>",
          '</tpl>',
          "</table>");

      Ext.create('Ext.window.Window', {
        title: 'About Your Compass AE Instance',
        height: 400,
        width: 400,
        layout: 'fit',
        resizable: true,
        autoScroll: true,
        tpl: tpl,
        data: compassAeInstance
      }).show();
    }
  });

  var compassDesktop;
  Ext.onReady(function () {
    Ext.QuickTips.init();

    compassDesktop = new MyDesktop.App();

    setTimeout(function () {
      Ext.get('loading').remove();
      Ext.get('loading-mask').fadeOut({remove: true});
    }, 1000);

    Compass.ErpApp.Utility.preventBrowserBack();
    Compass.ErpApp.Utility.setupErpAppLogoutRedirect();
  });
</script>
<div id="loading-mask"></div>
<div id="loading">
  <div class="loading-indicator">
    <p style='margin-left: -110px; margin-top: 30px;'>Loading Compass Desktop...</p>
  </div>
</div>
<%= setSessionTimeout %>
</body>
</html>
